
const validate = () => {
    const keyword = $('#keyword').val();
    return keyword !== '' && keyword !== null && keyword.length !== 0;
}
const search = () => {
    let productAutoComplete = $("#productAutoComplete");
    let productAutoList = $("#productAutoList");
    let keyword = $('#keyword').val();
    if (!validate()) {
        productAutoComplete.hide()
        return;
    }
    $.get(
        "/catalog/searchAjax",
        "keyword=" + keyword,
        (data) => {
            productAutoComplete.show();
            let str = "";
            $.each(data, (index, product)=> {
                str += "<li class=\"productAutoItem\" onmouseover='mouseOver(this)' onmouseleave='mouseLeave(this)' onclick='mouseClick(this)'>" + product.name + "</li>";
            });
            productAutoList.html(str);
        },
        "json"
    );

}
const mouseOver = (obj) => {
    $(obj).css("background", "yellow");
}
const mouseLeave = (obj) => {
    $(obj).css("background", "")
}
const mouseClick = (obj) => {
    $("#keyword").val($(obj).text());
    $("#productAutoComplete").hide();
}